<template>
    <div>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item> <i class="el-icon-lx-calendar"></i> 考勤时间管理 </el-breadcrumb-item>
                <el-breadcrumb-item>定时任务</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <div class="form-box">
                <el-form ref="form" :model="form" label-width="120px">
                    <el-divider content-position="left">定时任务时间</el-divider>
                    <el-form-item label="签到生成时间">
                        <el-time-picker v-model="startTime" :format="timeformat" :value-format="timeformat" placeholder="暂未签到">
                        </el-time-picker>
                        <el-button type="primary" class="left" @click="onSubmit('startTime', startTime, '')" icon="el-icon-edit"
                            >修改</el-button
                        >
                    </el-form-item>

                    <el-form-item label="签到结算时间">
                        <el-time-picker v-model="endTime" :format="timeformat" :value-format="timeformat" placeholder="暂未签到">
                        </el-time-picker>
                        <el-button type="primary" class="left" @click="onSubmit('endTime', endTime, '')" icon="el-icon-edit"
                            >修改</el-button
                        >
                    </el-form-item>

                    <el-form-item label="工资发放时间">
                        <el-input v-model="day" style="width: 100px; margin-right: 30px">
                            <template slot="append">日</template>
                        </el-input>
                        <el-time-picker v-model="salaryTime" :format="timeformat" :value-format="timeformat" placeholder="暂未签到">
                        </el-time-picker>

                        <el-button type="primary" class="left" @click="onSubmit('salaryTime', salaryTime, day)" icon="el-icon-edit"
                            >修改</el-button
                        >
                    </el-form-item>

                    <el-form-item>
                        <el-button @click="goback" icon="el-icon-arrow-left">返回</el-button>
                        <el-button type="warning" @click="reset()" icon="el-icon-refresh-right">重置</el-button>
                    </el-form-item>
                </el-form>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: 'baseform',
    inject: ['reload'],
    data() {
        return {
            id: this.$route.query.id,
            employee: {},
            check: {},
            form: {},
            times: [],
            startTime: '',
            endTime: '',
            day: '',
            salaryTime: '',
            dateformat: 'yyyy-MM-dd',
            timeformat: 'HH:mm:ss',
            result: {}
        };
    },
    created: function () {
        this.init();
    },
    methods: {
        async init() {
            var a = await this.$http.get('/times');
            if (a.code == 200) {
                this.times = a.data;
                this.initTime(this.times);
            } else {
                this.$message.error(a.message);
            }
        },

        initTime(times) {
            let s = times[0].cron.split(' ');

            let startTime1 = s[0].length == 1 ? '0' + s[0] : s[0];
            let startTime2 = s[1].length == 1 ? '0' + s[1] : s[1];
            let startTime3 = s[2].length == 1 ? '0' + s[2] : s[2];
            this.startTime = startTime3 + ':' + startTime2 + ':' + startTime1;

            let e = times[1].cron.split(' ');

            let endTime1 = e[0].length == 1 ? '0' + e[0] : e[0];
            let endTime2 = e[1].length == 1 ? '0' + e[1] : e[1];
            let endTime3 = e[2].length == 1 ? '0' + e[2] : e[2];
            this.endTime = endTime3 + ':' + endTime2 + ':' + endTime1;

            let sa = times[2].cron.split(' ');
            let salaryTime1 = sa[0].length == 1 ? '0' + sa[0] : sa[0];
            let salaryTime2 = sa[1].length == 1 ? '0' + sa[1] : sa[1];
            let salaryTime3 = sa[2].length == 1 ? '0' + sa[2] : sa[2];
            this.salaryTime = salaryTime3 + ':' + salaryTime2 + ':' + salaryTime1;
            this.day = sa[3];
        },

        async onSubmit(code, time, day) {
            let s = {
                code: code,
                time: time,
                day: day
            };
            var d = await this.$http.put('/time', s);
            if (d.code == 200) {
                this.reload();
                this.$message.success(d.message);
            } else {
                this.$message.error(d.message);
            }
        },

        reset() {
            this.$confirm('此操作将恢复至未修改前, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            })
                .then(() => {
                    this.initTime(this.times);
                })
                .catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消重置'
                    });
                });
        },

        goback() {
            this.$router.go(-1);
        }
    }
};
</script>
<style scoped>
.left {
    margin-left: 15px;
}
</style>